
.major-list-outer {
}
.major-list {
}
.major-list li {
}
.major-list li a, .major-list li a span {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.front-face {
    z-index: 2;
}
.major-list li a span.back-face {
    background: rgba(0, 0, 0, 0) url("../../img/test3/png1.png") no-repeat scroll 0 0;
    display: none;
    z-index: 3;
}
.major-list li a {
    overflow: hidden;
}
.major-list li a:hover span.back-face {
    display: block;
}
.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}
@keyframes flipInX {
    0% {
        opacity: 0;
        transform: perspective(400px) rotateX(90deg);
    }
    40% {
        transform: perspective(400px) rotateX(-10deg);
    }
    70% {
        transform: perspective(400px) rotateX(10deg);
    }
    100% {
        opacity: 1;
        transform: perspective(400px) rotateX(0deg);
    }
}
@keyframes flipInX {
    0% {
        opacity: 0;
        transform: perspective(400px) rotateX(90deg);
    }
    40% {
        transform: perspective(400px) rotateX(-10deg);
    }
    70% {
        transform: perspective(400px) rotateX(10deg);
    }
    100% {
        opacity: 1;
        transform: perspective(400px) rotateX(0deg);
    }
}
.flipInX {
    animation-name: flipInX;
    backface-visibility: visible !important;
}
@keyframes flipOutX {
    0% {
        opacity: 1;
        transform: perspective(400px) rotateX(0deg);
    }
    100% {
        opacity: 0;
        transform: perspective(400px) rotateX(90deg);
    }
}
@keyframes flipOutX {
    0% {
        opacity: 1;
        transform: perspective(400px) rotateX(0deg);
    }
    100% {
        opacity: 0;
        transform: perspective(400px) rotateX(90deg);
    }
}
.flipOutX {
    animation-name: flipOutX;
    backface-visibility: visible !important;
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.fadeIn {
    animation-name: fadeIn;
    height: 100%;
}
@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.fadeOut {
    animation-name: fadeOut;
    height: 0;
}
@keyframes tada {
    0% {
        transform: scale(1);
    }
    10%, 20% {
        transform: scale(0.9) rotate(-3deg);
    }
    30%, 50%, 70%, 90% {
        transform: scale(1.1) rotate(3deg);
    }
    40%, 60%, 80% {
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
    }
}
@keyframes tada {
    0% {
        transform: scale(1);
    }
    10%, 20% {
        transform: scale(0.9) rotate(-3deg);
    }
    30%, 50%, 70%, 90% {
        transform: scale(1.1) rotate(3deg);
    }
    40%, 60%, 80% {
        transform: scale(1.1) rotate(-3deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
    }
}
@keyframes flash {
    0%, 50%, 100% {
        opacity: 0;
    }
    25%, 75% {
        opacity: 1;
    }
}
@keyframes flash {
    0%, 50%, 100% {
        opacity: 0;
    }
    25%, 75% {
        opacity: 1;
    }
}
@keyframes bounceInUp {
    0% {
        opacity: 0;
        transform: translateY(2000px);
    }
    60% {
        opacity: 1;
        transform: translateY(-30px);
    }
    80% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes bounceInUp {
    0% {
        opacity: 0;
        transform: translateY(2000px);
    }
    60% {
        opacity: 1;
        transform: translateY(-30px);
    }
    80% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0px);
    }
}
.animated.bounceInUp {
    animation-name: bounceInUp;
}
@keyframes bounceInDown {
    0% {
        opacity: 0;
        transform: translateY(-2000px);
    }
    60% {
        opacity: 1;
        transform: translateY(30px);
    }
    80% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes bounceInDown {
    0% {
        opacity: 0;
        transform: translateY(-2000px);
    }
    60% {
        opacity: 1;
        transform: translateY(30px);
    }
    80% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}
.animated.bounceInDown {
    animation-name: bounceInDown;
}
@keyframes bounceInLeft {
    0% {
        opacity: 0;
        transform: translateX(-2000px);
    }
    60% {
        opacity: 1;
        transform: translateX(30px);
    }
    80% {
        transform: translateX(-10px);
    }
    100% {
        transform: translateX(0px);
    }
}
@keyframes bounceInLeft {
    0% {
        opacity: 0;
        transform: translateX(-2000px);
    }
    60% {
        opacity: 1;
        transform: translateX(30px);
    }
    80% {
        transform: translateX(-10px);
    }
    100% {
        transform: translateX(0px);
    }
}
.animated.bounceInLeft {
    animation-name: bounceInLeft;
}
@keyframes bounceInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }
    60% {
        opacity: 1;
        transform: translateX(-30px);
    }
    80% {
        transform: translateX(10px);
    }
    100% {
        transform: translateX(0px);
    }
}
@keyframes bounceInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }
    60% {
        opacity: 1;
        transform: translateX(-30px);
    }
    80% {
        transform: translateX(10px);
    }
    100% {
        transform: translateX(0px);
    }
}
.animated.bounceInRight {
    animation-name: bounceInRight;
}
@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }
    100% {
        opacity: 1;
        transform: translateX(0px);
    }
}
@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }
    100% {
        opacity: 1;
        transform: translateX(0px);
    }
}
@keyframes slideOutLeft {
    0% {
        opacity: 1;
        transform: translateX(0px);
    }
    100% {
        opacity: 0;
        transform: translateX(-2000px);
    }
}
@keyframes slideOutLeft {
    0% {
        opacity: 1;
        transform: translateX(0px);
    }
    100% {
        opacity: 0;
        transform: translateX(-2000px);
    }
}
.from-top {
    transform-origin: 0 0 0;
}
.from-left {
    transform-origin: 0 100% 0;
}
.from-top, .from-left {
    animation: 0.23s ease-out 0s normal none 1 running enter-clockwise;
}
.from-right {
    transform-origin: 100% 100% 0;
}
.from-bottom {
    transform-origin: 0 100% 0;
}
.from-right, .from-bottom {
    animation: 0.23s ease-out 0s normal none 1 running enter-anti-clockwise;
}
.to-top {
    transform-origin: 0 0 0;
}
.to-left {
    transform-origin: 0 100% 0;
}
.to-top, .to-left {
    animation: 0.23s ease-out 0s normal none 1 running leave-anti-clockwise;
}
.to-right {
    transform-origin: 100% 100% 0;
}
.to-bottom {
    transform-origin: 0 100% 0;
}
.to-right, .to-bottom {
    animation: 0.23s ease-out 0s normal none 1 running leave-clockwise;
}
@keyframes enter-clockwise {
    0% {
        transform: rotate(-90deg);
        z-index: 3;
    }
    100% {
        transform: rotate(0deg);
        z-index: 3;
    }
}
@keyframes enter-clockwise {
    0% {
        transform: rotate(-90deg);
        z-index: 3;
    }
    100% {
        transform: rotate(0deg);
        z-index: 3;
    }
}
@keyframes enter-anti-clockwise {
    0% {
        transform: rotate(90deg);
        z-index: 3;
    }
    100% {
        transform: rotate(0deg);
        z-index: 3;
    }
}
@keyframes enter-anti-clockwise {
    0% {
        transform: rotate(90deg);
        z-index: 3;
    }
    100% {
        transform: rotate(0deg);
        z-index: 3;
    }
}
@keyframes leave-clockwise {
    0% {
        transform: rotate(0deg);
        z-index: 3;
    }
    100% {
        transform: rotate(90deg);
        z-index: 3;
    }
}
@keyframes leave-clockwise {
    0% {
        transform: rotate(0deg);
        z-index: 3;
    }
    100% {
        transform: rotate(90deg);
        z-index: 3;
    }
}
@keyframes leave-anti-clockwise {
    0% {
        transform: rotate(0deg);
        z-index: 3;
    }
    100% {
        transform: rotate(-90deg);
        z-index: 3;
    }
}
@keyframes leave-anti-clockwise {
    0% {
        transform: rotate(0deg);
        z-index: 3;
    }
    100% {
        transform: rotate(-90deg);
        z-index: 3;
    }
}
@keyframes slideDown {
    0% {
        transform: translateY(-75px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes slideDown {
    0% {
        transform: translateY(-75px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes slideUp {
    0% {
        transform: translateY(0px);
    }
    100% {
        transform: translateY(-75px);
    }
}
@keyframes slideUp {
    0% {
        transform: translateY(0px);
    }
    100% {
        transform: translateY(-75px);
    }
}
@keyframes bounceStrenth {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    60% {
        opacity: 1;
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes bounceStrenth {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    60% {
        opacity: 1;
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes bounceBigStrenth {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    60% {
        opacity: 1;
        transform: scale(1.4);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes bounceBigStrenth {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    60% {
        opacity: 1;
        transform: scale(1.4);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
